<template>
  <div class="skills">
    <ul style="padding-left:15px">
      <li v-for="(item,index) in skills"><span>{{item.skillExplain}}</span></li>
    </ul>
  </div>
</template>

<script>
import {addSkill, delSkill} from "@/api/resume";

export default {
  name: "skills",
  props:["skills","resumeId"],
  data(){
    return{
      isAddSkill:false,
      addContent:'',
      skill:{
        resumeId:this.resumeId ,
        skillExplain: '',
      }
    }
  },
  methods:{
    addHandle(){
      addSkill(this.skill).then(res=>{
        this.skills.push(res.data.extend.skill)
        this.skill.skillExplain=''
      })
    },
    delHandle(index,id){
      console.log(id)
      delSkill(id).then(res=>{
        this.skills.splice(index,1)
        this.$message.success("删除成功!")
      })

    }
  }
}
</script>

<style lang="stylus" scoped>
.skills
  height auto
  min-height 50px
.add-ex
  height 40px
  display flex
  justify-content center
  align-items center
  & i
    cursor pointer
    font-size 30px
    background #07c160
    border-radius 50%
    color #f7faf9
.skills li
  line-height 30px
.del
  float right
</style>
